(function () {
    const checkAll = document.querySelector('.checkAll');
    const cks = document.querySelectorAll('.cks');
    checkAll.addEventListener('click', function () {
        for (let i = 0; i < cks.length; i++) {
            cks[i].checked = checkAll.checked;
        }
    });
    for (let i = 0; i < cks.length; i++) {
        cks[i].addEventListener('click', function () {
            checkAll.checked =
                document.querySelectorAll('.cks:checked').length === cks.length;
        });
    }
    // 点击全选按钮
    const btnAll = document.querySelector('.btnAll');
    btnAll.addEventListener('click', function () {
        checkAll.checked = true;
        for (let i = 0; i < cks.length; i++) {
            cks[i].checked = true;
        }
    });
    // 点击群不选按钮
    const btnDisAll = document.querySelector('.btnDisAll');
    btnDisAll.addEventListener('click', function () {
        checkAll.checked = false;
        for (let i = 0; i < cks.length; i++) {
            cks[i].checked = false;
        }
    });
    // 点击反选
    const positive = document.querySelector('.positive');
    positive.addEventListener('click', function () {
        for (let i = 0; i < cks.length; i++) {
            if (cks[i].checked) {
                cks[i].checked = false;
            } else {
                cks[i].checked = true;
            }
        }
        checkAll.checked =
            document.querySelectorAll('.cks:checked').length === cks.length;
    });
    // 点击提交并打印
    const postPrint = document.querySelector('.postPrint');
    postPrint.addEventListener('click', function (e) {
        console.clear();
        e.preventDefault();
        let count = 0;
        cks.forEach(function (item) {
            if (item.checked) {
                count++;
                console.log(item.name);
            }
        });
        if (!count) {
            console.log(null);
        }
    });
})();
(function () {
    let guangZhou = document.querySelector('.guangZhou');
    let beiJing = document.querySelector('.beiJing');
    let shangHai = document.querySelector('.shangHai');
    let siChuan = document.querySelector('.siChuan');
    let shenZhen = document.querySelector('.shenZhen');
    let ul = document.querySelector('ul');
    // 创建节点
    guangZhou.addEventListener('click', function () {
        if (!document.querySelector('.liGzhou')) {
            let liGzhou = document.createElement('li');
            liGzhou.className = 'liGzhou';
            liGzhou.appendChild(document.createTextNode('广州'));
            ul.appendChild(liGzhou);
        } else {
            alert('该城市已经存在');
        }
    });
    beiJing.addEventListener('click', function () {
        if (!document.querySelector('.liBjing')) {
            let liBjing = document.createElement('li');
            liBjing.className = 'liBjing';
            liBjing.appendChild(document.createTextNode('北京'));
            ul.appendChild(liBjing);
        } else {
            alert('该城市已经存在');
        }
    });
    shangHai.addEventListener('click', function () {
        if (!document.querySelector('.liShai')) {
            let liShai = document.createElement('li');
            liShai.className = 'liShai';
            liShai.appendChild(document.createTextNode('上海'));
            ul.appendChild(liShai);
        } else {
            alert('该城市已经存在');
        }
    });
    siChuan.addEventListener('click', function () {
        if (!document.querySelector('.liSchuan')) {
            let liSchuan = document.createElement('li');
            liSchuan.className = 'liSchuan';
            liSchuan.appendChild(document.createTextNode('四川'));
            ul.appendChild(liSchuan);
        } else {
            alert('该城市已经存在');
        }
    });
    shenZhen.addEventListener('click', function () {
        if (!document.querySelector('.liSzhen')) {
            let liSzhen = document.createElement('li');
            liSzhen.className = 'liSzhen';
            liSzhen.appendChild(document.createTextNode('深圳'));
            ul.appendChild(liSzhen);
        } else {
            alert('该城市已经存在');
        }
    });
    // 广州插入节点
    (function () {
        let gPreB = document.querySelector('.gPreB');
        gPreB.addEventListener('click', function () {
            if (!document.querySelector('.liGzhou')) {
                alert('广州城市不存在');
            } else if (!document.querySelector('.liBjing')) {
                alert('北京城市不存在');
            } else {
                // 获取广州
                let liGzhou = document.querySelector('.liGzhou');
                // 获取北京
                let liBjing = document.querySelector('.liBjing');
                ul.insertBefore(liGzhou, liBjing);
            }
        });
    })();
    // 使用广州节点替换北京节点
    (function () {
        let gRepB = document.querySelector('.gRepB');
        gRepB.addEventListener('click', function () {
            if (!document.querySelector('.liGzhou')) {
                alert('广州城市不存在');
            } else if (!document.querySelector('.liBjing')) {
                alert('北京城市不存在');
            } else {
                // 获取广州
                let liGzhou = document.querySelector('.liGzhou');
                // 获取北京
                let liBjing = document.querySelector('.liBjing');
                ul.replaceChild(liGzhou, liBjing);
            }
        });
    })();
    // 删除广州节点
    (function () {
        let gDel = document.querySelector('.gDel');
        gDel.addEventListener('click', function () {
            if (!document.querySelector('.liGzhou')) {
                alert('广州城市不存在');
            } else {
                document.querySelector('.liGzhou').remove();
            }
        });
    })();
    // 读取当前列表结构
    (function () {
        let readCity = document.querySelector('.readCity');
        readCity.addEventListener('click', function () {
            console.log(ul.cloneNode(true));
        });
    })();
    // 读取北京内的结点
    (function () {
        let readBjing = document.querySelector('.readBjing');
        readBjing.addEventListener('click', function () {
            if (!document.querySelector('.liBjing')) {
                alert('北京城市不存在');
            } else {
                let liBjing = document.querySelector('.liBjing');
                console.log(liBjing.cloneNode());
            }
        });
    })();
})();
